<template>
  <div>
    <a-modal v-model="visibleOther" title="企业选择" :width="1000" :footer="null">
      <a-transfer :data-source="mockData" :titles="['待选列表', '已选列表']" :target-keys="targetKeys"
        :selected-keys="selectedKeys" show-search
        :filter-option="(inputValue, item) => item.name.indexOf(inputValue) !== -1" :show-select-all="false"
        @change="handleChange" @selectChange="handleSelectChange">
        <template slot="children" slot-scope="{
                    props: { direction, filteredItems, selectedKeys, disabled: listDisabled },
                    on: { itemSelectAll, itemSelect },
                  }">
          <a-table :row-selection="getRowSelection({ disabled: listDisabled, selectedKeys, itemSelectAll, itemSelect })"
            :pagination="false" :scroll="{ y: 400 }" :columns="[{ dataIndex: 'name', title: '企业名称' }]"
            :data-source="filteredItems" size="small" :style="{ pointerEvents: listDisabled ? 'none' : null }"
            :custom-row="({ key, disabled: itemDisabled }) => ({ on: { click: () => { if (itemDisabled || listDisabled) return; itemSelect(key, !selectedKeys.includes(key)); }, }, })" />
        </template>
      </a-transfer>
    </a-modal>
  </div>
</template>

<script>
import store from '@/store'
import { caseQueryCaseRelation, caseOperateCaseRela } from '@/api/human/enterprise'
import difference from 'lodash/difference';
export default {
  name: 'enterpriseAllSelect',
  data() {
    return {
      mockData: [],
      targetKeys: [],
      selectedKeys: [],

      visibleOther: false,
      userData: [],
      caseId: '',
      enterpriseId: '',
      enterpriseIds: [],
      columns: [],
      loadData: []
    }
  },
  mounted() {

  },
  methods: {
    async handleChange(nextTargetKeys, direction, moveKeys) {
      // console.log('direction: ', direction);
      // console.log('nextTargetKeys: ', nextTargetKeys); // 右侧企业数据
      // console.log('moveKeys: ', moveKeys); // 移动的企业数据

      this.targetKeys = nextTargetKeys;
      let param = {
        caseId: this.caseId,
        enterpriseId: moveKeys,
        operateType: 0
      }
      if (direction == "right") {
        param.operateType = 1;
      } else {
        param.operateType = 2;
      }
      const { code } = await caseOperateCaseRela(param);
      if (code == '1') {
        // this.visibleOther = false;
        this.$message.success('操作成功');
      }
    },
    handleSelectChange(sourceSelectedKeys, targetSelectedKeys) {
      this.selectedKeys = [...sourceSelectedKeys, ...targetSelectedKeys];
      this.enterpriseIds = targetSelectedKeys;
      // console.log('sourceSelectedKeys: ', sourceSelectedKeys);
      // console.log('targetSelectedKeys: ', targetSelectedKeys);
    },
    getRowSelection({
      disabled,
      selectedKeys,
      itemSelectAll,
      itemSelect
    }) {
      return {
        getCheckboxProps: item => ({
          props: {
            disabled: disabled || item.disabled
          }
        }),
        onSelectAll(selected, selectedRows) {
          const treeSelectedKeys = selectedRows
            .filter(item => !item.disabled)
            .map(({
              key
            }) => key);
          const diffKeys = selected ?
            difference(treeSelectedKeys, selectedKeys) :
            difference(selectedKeys, treeSelectedKeys);
          itemSelectAll(diffKeys, selected);
        },
        onSelect({
          key
        }, selected) {
          itemSelect(key, selected);
        },
        selectedRowKeys: selectedKeys,
      };
    },
    async openAdmin(rows) {
      this.enterpriseId = rows.enterpriseId;
      this.caseId = rows.caseId;
      this.mockData = [];
      this.enterpriseIds = [];
      this.selectedKeys = [];
      this.targetKeys = [];

      const { code, data } = await caseQueryCaseRelation(this.caseId);
      if (code == '1') {
        let noUserData = data.waitChooseEnterprise, userData = data.chooseEnterprise;
        if (userData.length > 0) {
          let selKeys = userData.map(item => item.enterpriseId);
          this.targetKeys = selKeys;
          // this.selectedKeys = selKeys;
        }
        noUserData.forEach(item => {
          let disabled = false;
          this.mockData.push({
            key: item.enterpriseId,
            name: item.name,
            disabled
          });
        })
        console.log(this.targetKeys, this.selectedKeys);
        this.visibleOther = true;
      }
    },
    async addFormSubmit() {
      let params = {};
      if (this.enterpriseIds.length == 0) {
        return this.$message.warning('请选择(已选列表)管理员');
      }
      params.enterpriseId = this.enterpriseId;
      params.enterpriseIds = this.enterpriseIds;
      const { code } = await sysApplyAdminToEnterprise(params);
      if (code === '1') {
        this.visibleOther = false;
      }
    }
  }
}
</script>

